<template>
	<view>
		<view class="sign_conent_box">
			<view class="sign_conent">
				<view class="sign_conent_title alpsoftjurnal">
					{{$t('signIn.title')}}
					<span class="sign_conent_title_span">{{qdjl}}</span>
					{{$t('signIn.day')}}
				</view>
				<view class="ft14 mt10 alpsoftjurnal" style="color: #999; margin-bottom: 20rpx;">{{$t('signIn.desc')}}</view>
				<view class="day alpsoftjurnal">
					<view class="line" :class="item.xz == 2?'select':''" v-for="(item, index) in sign_list "
						:key="index">
						<image class="image" src="@/static/gold.png"></image>
						<view class="num">{{item.discount}}</view>
						<view class="border"></view>
						<view class="date">
							{{ item.day }}
						</view>
					</view>
					<view class="bj2"></view>
				</view>
				<view class="sign_rule alpsoftjurnal" style="margin-bottom: 20rpx;">
					{{$t('signIn.title')}}{{qdjl}}{{$t('signIn.day')}}，{{$t('signIn.text2')}}
					<span v-if="qdjl<7">
						{{sign_rule[qdjl]}}
					</span>
					<span v-else>
						{{sign_rule[0]}}
					</span>
					{{$t('user.gold2')}}
				</view>
				<view class="sign_conent_btn alpsoftjurnal" @click="cksigin()">{{$t('signIn.button')}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			sign_list: {},
			sign_rule: {
				type: Array,
				default: () => []
			},
			qdjl: 0,
			tdsy: 0,
		},
		data() {
			return {};
		},
		methods: {
			cksigin() {
				if (uni.getStorageSync("userinfo")) {
					let this_ = this
					let data = {};
					data.tdsy = this.tdsy
					data.token = uni.getStorageSync("userinfo").token
					data.uid = uni.getStorageSync("userinfo").id
					data.lang = uni.getStorageSync('language')
					uni.request({
						url: this.configs.webUrl + '/api/user/qingdao',
						data: data,
						success: data => {
							uni.showModal({
								title: this.$t("commmon.text1"),
								content: data.data.msg,
								showCancel: false,
								success: res => {
									if (data.data.code == 1) {
										this_.$emit('cksigin')
									}
								}
							});
						},
						fail: (data, code) => {}
					});
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
					// uni.showModal({
					// 	title: this.$t("commmon.text1"),
					// 	content: '请先登录',
					// 	showCancel: true,
					// 	confirmText: "登录",
					// 	success: function(res) {
					// 		if (res.confirm) {
					// 			uni.navigateTo({
					// 				url: '/pages/login/login'
					// 			})
					// 		} else if (res.cancel) {
					// 			//uni.navigateBack();						
					// 		}
					// 	}
					// });
				}
			},
		}
	};
</script>

<style lang="scss">
	.day {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		z-index: 10;

		.bj2 {
			position: absolute;
			background: #FFCEDB;
			width: 100%;
			height: 14rpx;
			bottom: 46rpx;
			z-index: -1;
			border-radius: 16rpx;
		}

		.line {
			text-align: center;

			.image {
				width: 56rpx;
				height: 60rpx;
				margin: 0 auto;
			}

			.date,
			.num {
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #333333;
				height: 30rpx;
				margin: 10rpx 0;
			}
			.num {
				font-weight: 600;
			}

			.border {
				width: 8rpx;
				height: 8rpx;
				background: #fff;
				border-radius: 50%;
				margin: 0 auto;
			}
		}

		.select {

			.date,
			.num {
				color: #F75581;
			}

			.border {
				background: #F75581;
			}
		}
	}

	.sign_conent_box {
		width: 100%;
		display: flex;
		justify-content: center;
		margin-top: 30upx;

		.sign_conent {
			width: 686upx;
			// background: white;
			// border-radius: 20upx;
			padding: 0upx 0upx;
			box-sizing: border-box;

			.sign_conent_title {
				width: 100%;
				font-size: 36upx;
				font-weight: bold;
				color: #333333;

				.sign_conent_title_span {
					color: #F75581 !important;
				}
			}

			.sign_list_aligns {
				width: 100%;
				padding: 30upx 0 30upx 0;
				box-sizing: border-box;

				.scroll-view_H {
					width: 100%;
					display: flex;
					white-space: nowrap;

					.scroll_view_items {
						display: inline-block;
					}

					.scroll_view_itemsv {
						display: flex;
					}

					.scroll_view_item {
						.scroll_view_item_img_box {
							width: 60upx;
							height: 30upx;
							position: relative;

							.scroll_view_item_top {
								font-size: 24upx;
								color: #bfbfbf;
								// font-weight: bold;
								position: absolute;
								top: 14upx;
								width: 100%;
								text-align: center;
								z-index: 1;
							}

							.scroll_view_item_bottom {
								font-size: 12upx;
								color: #ffe29d;
								position: absolute;
								bottom: 18upx;
								left: 42upx;
								z-index: 2;
							}
						}

						.scroll_view_item_tips {
							width: 60upx;
							text-align: center;
							font-size: 24upx;
							padding-top: 40upx;
							color: #333333;
						}

						.scroll_view_item_img {
							width: 60upx;
							height: 60upx;
							position: absolute;
							top: 0;
							left: 0;
							z-index: 0;
						}
					}

					.scroll_xian {
						width: 40upx;
						height: 4upx;
						background: #bfbfbf;
						margin-top: 30upx;
					}
				}
			}

			.sign_rule {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #F75581;
			}

			.sign_conent_btn {
				width: 100%;
				border-radius: 45upx;
				background: linear-gradient(90deg, #F75581 0%, #C860FF 100%);
				color: #ffffff;
				text-align: center;
				padding: 22upx 0;
				font-size: 32upx;
			}
		}
	}
</style>